$(function () {
  // ***********************加载用户列表

  //引入模块
  let laypage = layui.laypage
  let layer = layui.layer
  let data = {
    pagenum: 1,
    pagesize: 5
  }
  function list() {
    $.ajax({
      url: 'admin/users',
      type: 'GET',
      data: data,
      success: function (res) {
        if (res.status == 0) {
          let str = '';
          console.log(res.data);
          res.data.forEach(item => {
  
            str += `<tr>
            <td>${item.id}</td>
            <td>${item.username}</td>
            <td>${item.nickname}</td>
            <td>${item.email}</td>
            <td>
              <button type="button" class="layui-btn layui-btn-xs ">
                <a style="color: #fff" target="iframeArea" href="./edit.html?${item.id}">编辑</a>
              </button>
              <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete">删除</button>
              <button type="button" class="layui-btn layui-btn-xs layui-btn-normal delete">重置密码</button>
            </td>
          </tr>`
          })
          $('tbody').html(str);
          pageRender(res.total)
        }
      }
    })
  }

  list()
  // ************************************************************加载分页器
  function pageRender(total) {
    laypage.render({
      elem: 'articlePage',
      count: total, // 数据总数，从服务端得到,
      limit: data.pagesize, // 显示几条数据,依据全局变量data配置
      curr: data.pagenum, // 显示第几页


      // 可选
      limits: [2, 3, 5, 10], // 控制分页器，用户选择每页可以显示几条！
      layout: ['prev', 'page', 'next', 'count', 'limit', 'skip'], // 有啥功能

      // 分页器：用户操作，直接跳到某个页码;

      // 函数：设置给分页监听用户修改动作，会执行的一个函数；
      //       非用户操作，也会执行
      jump: function (obj, key) {
        // key：非用户操作 true，
        //      用户操作有个值；undefined;
        // obj：得到当前分页器数据状态


        // 当是用户操作的时候，才重新加载列表
        if (key == undefined) {
          // 业务：列表 按照用户的选择(页码2和显示多少条5)重新加载数据！
          data.pagenum = obj.curr;
          data.pagesize = obj.limit;
          list();
        }
      }


    });
  }





  // ************************删除用户




  // ***********************重置密码的form表单
  let str = `<form id="repwd-form" class="layui-form" style="margin: 15px 30px 0 0">
      <!-- 第一行：密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
          <input type="text" name="password" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
        </div>
      </div>
      <!-- 第二行：确认密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-block">
          <input type="text" required lay-verify="required" placeholder="请重复输入新密码" autocomplete="off" class="layui-input">
        </div>
      </div>
      <!-- 第三行：按钮 -->
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
          <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
      </div>
    </form>`;





})